<html xmlns:th="http://www.thymeleaf.org">
<style>
    .layui-form-item .layui-input-inline{
        width: 500px;
    }
</style>
<fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
    <legend th:text="${menu == null}?'菜单录入':'编辑菜单'"></legend>
</fieldset>

<form class="layui-form" action="return false" lay-filter="formUpdate">
    <div class="layui-form-item">
        <label class="layui-form-label">类型</label>
        <div class="layui-input-block">
            <input type="radio" name="type" value="0" title="菜单" checked="" lay-filter="type"/>
            <input type="radio" name="type" value="1" title="按钮" lay-filter="type" />
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">菜单名</label>
            <div class="layui-input-inline">
                <input type="text" name="name" lay-verify="required|menuname" autocomplete="off" placeholder="请输入菜单名" class="layui-input" />
            </div>
        </div>
    </div>
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">URL</label>
            <div class="layui-input-inline">
                <input type="text" name="url" lay-verify="URL" placeholder="请输入URL" autocomplete="off" class="layui-input" />
            </div>
        </div>
    </div>

    <div class="layui-form-item menu_hide">
        <div class="layui-inline">
            <label class="layui-form-label">图标</label>
            <div class="layui-input-inline">
                <input type="tel" name="iocclass"  placeholder="请输入字体图标" autocomplete="off" class="layui-input" />
            </div>
        </div>
    </div>
    <div class="layui-form-item menu_hide">
        <div class="layui-inline">
            <label class="layui-form-label">排序值</label>
            <div class="layui-input-inline">
                <input type="number" name="order" lay-verify="order" autocomplete="off" class="layui-input" value="0" />
            </div>
        </div>
    </div>


    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">权限码</label>
            <div class="layui-input-inline">
                <input type="text" name="authorization"  placeholder="请输入权限码"  autocomplete="off" class="layui-input" />
            </div>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">上级菜单</label>
            <div class="layui-input-inline">
                <select name="p_id" lay-filter="aihao" >
                    <option value="0">一级菜单</option>
                    <option th:each="Menu,m:${menuList}" th:value="${Menu.id}" th:text="${Menu.name}"></option>
                </select>
            </div>
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" lay-submit="" lay-filter="menu">立即提交</button>
        </div>
    </div>
</form>
<script th:inline="javascript">
    /* <![CDATA[*/
    layui.use(['form', 'layedit', 'laydate','element'], function(){
        var form = layui.form;
        var layer = layui.layer;
        var layedit = layui.layedit;
        var laydate = layui.laydate;
        var element=layui.element;


        //自定义验证规则
        form.verify({
            menuname:[/^[\S]{1,9}$/,'菜单长度1-9个字'],
            URL:[/^(\/[a-zA-Z]*\/[a-zA-Z]*\/[a-zA-Z]*)|(\s{0})$/,'URL格式化不正确！'],
            order:[/^(\d{1,2}|100)$/,'排序值范围是0-100']
        });
        form.on('radio(type)',function(data){
            $(".menu_hide").toggleClass("layui-hide")
        })
        var menu=/*[[ ${menu} ]]*/;
        var url = /*[[ ${#httpServletRequest.getContextPath()+'/admin/menu/addMenu'} ]]*/
        if(menu){
            form.val("formUpdate", {
                "name": menu.name // "name": "value"
                ,"iocclass":menu.iocclass
                ,"url":menu.url
                ,"p_id": menu.p_id
                ,"type": menu.type
                ,"order": menu.order
                ,"authorization": menu.authorization
            })
            url = /*[[ ${#httpServletRequest.getContextPath()+'/admin/menu/editMenu'} ]]*/
        }
        //监听提交
        form.on('submit(menu)', function(data){
            if(menu){
                data.field.id=menu.id;
            }
            ajaxUtil(url,data.field,function(){
                layer.confirm('操作成功，是否返回列表页面？', {
                    btn: ['确定', '取消']
                }, function(index, layero){
                    layer.close(index);
                    openwindows(/*[[${#httpServletRequest.getContextPath()+'/admin/menu/list'}]]*/,null,$)
                }, function(index){
                    layer.close(index);
                });
            });
            return false;
        });
        form.render();

    });
    /* ]]> */
</script>
</html>